<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="ZhangBin">
    <meta name="Keywords" content="表格拖拽,表格拖拽交换,表格,模仿百度云盘,百度云盘,jquery,js">
    <meta name="Description" content="">
    <title>模仿百度云盘表格拖拽换位</title>
    <link rel="shortcut icon" href="/static/img/Head.png" type="image/x-icon"/>
    <link href="css/index.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="container">
    <table id="table">
        <thead>
        <tr>
            <th></th>
            <th>ID</th>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
            <th>职位</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody id="tbody">
        <tr>
            <td><input type="checkbox" class="con_box"/></td>
            <td>1</td>
            <td>小明</td>
            <td>21</td>
            <td>男</td>
            <td>Java开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>2</td>
            <td>小红</td>
            <td>22</td>
            <td>男</td>
            <td>PHP开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>3</td>
            <td>小紫</td>
            <td>23</td>
            <td>女</td>
            <td>Android开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>4</td>
            <td>小兰</td>
            <td>24</td>
            <td>女</td>
            <td>IOS开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>5</td>
            <td>小黄</td>
            <td>24</td>
            <td>男</td>
            <td>MySql开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>6</td>
            <td>小黑</td>
            <td>26</td>
            <td>男</td>
            <td>IOS开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>7</td>
            <td>小白</td>
            <td>24</td>
            <td>女</td>
            <td>IOS开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>8</td>
            <td>小绿</td>
            <td>27</td>
            <td>男</td>
            <td>JAVA开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        <tr>
            <td><input type="checkbox" class="con_box"/>
            <td>9</td>
            <td>二哈</td>
            <td>28</td>
            <td>男</td>
            <td>IOS开发</td>
            <td class="operate"><a class="o_del">删</a><a class="o_upt">更</a><a class="o_detail">详</a></td>
        </tr>
        </tbody>
    </table>
    <a id="del_checked" class="o_btn">删除选中</a>
</div>
<script type="text/javascript" src="/static/plugins/jQuery/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
